@extends('admin.layout.layout', ['row' => @$page])

@section('contain')


    <div class="portlet">
        <div class="portlet-title">
            <div class="caption">
                <span class="caption-subject font-green-sharp bold uppercase">{{ $title  }}</span>
            </div>
            <div class="actions">
                <div class="item">
                    <button class="btn btn-sm btn-primary" id="addRole">{{ ts('新增') }}</button>
                </div>
            </div>
        </div>

        <div>
            <table class="table table-s1">
                <thead>
                <tr>
                    <th>{{ ts('ID') }}</th>
                    <th>{{ ts('CNROLENAME') }}</th>
                    <th>{{ ts('FTROLENAME') }}</th>
                    <th>{{ ts('ENROLENAME') }}</th>
                    <th>{{ ts('STATUS') }}</th>
                    <th style="width:270px">{{ ts('OPTION') }}</th>
                </tr>
                </thead>
                <tbody>
                @if (!empty($data))
                    @foreach($data as $v)
                        <tr class="item-list">
                            <td>
                                <div class="truncated-3">{{ @$v->id }}</div>
                            </td>
                            <td>
                                <div class="truncated-3">{{ @$v->simple_chinese_name }}</div>
                            </td>
                            <td>
                                <div class="truncated-3">{{ @$v->traditional_chinese_name }}</div>
                            </td>
                            <td>
                                <div class="truncated-3">{{ $v->english_name }}</div>
                            </td>
                            <td>
                                <div class="truncated-3">{{ $v->status ? ts('ACTIVE') : ts('DEACTIVE') }}</div>
                            </td>
                            <td>
                                <button onclick="">{{ $v->status ? ts('DEACTIVE') : ts('ACTIVE') }}</button>
                                <a class="btn btn-success btn-sm" href='/admin/module/{{ $v->id }}' target="_blank">{{ ts('dealer') }}</a>
                            </td>
                        </tr>
                    @endforeach
                @endif
                </tbody>
            </table>
            <div class="my-3">
            </div>
        </div>

    </div>

    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">{{ ts('添加角色') }}</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="form-group">
                        <label for="exampleInputEmail1">{{ ts('中文角色名') }}</label>
                        <input type="text" class="form-control" name="simple_chinese_name" id="simple_chinese_name" aria-describedby="emailHelp" placeholder="中文角色名">
                    </div>
                    <div class="form-group">
                        <label for="exampleInputEmail1">{{ ts('繁体中文名') }}</label>
                        <input type="text" class="form-control" name="traditional_chinese_name" id="traditional_chinese_name" placeholder="繁体角色名">
                    </div>
                    <div class="form-group">
                        <label for="exampleInputEmail1">{{ ts('英文角色名') }}</label>
                        <input type="text" class="form-control" name="english_name" id="english_name" aria-describedby="emailHelp" placeholder="英文角色名">
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">{{ ts('CLOSE') }}</button>
                    <button type="button" class="btn btn-primary" id="add_sure_role">{{ ts('ADD') }}</button>
                </div>
            </div>
        </div>
    </div>

@endsection

@section('script')
    <script type="text/javascript" src="/dist/layui/layui.all.js"></script>
    <script type="text/javascript">
        $(function () {
            $("#addRole").on("click", function () {
                $('#myModal').modal('show');
            });

            $("#add_sure_role").on("click", function () {
                let simple_chinese_name = $("#simple_chinese_name").val();
                let traditional_chinese_name = $("#traditional_chinese_name").val();
                let english_name = $("#english_name").val();
                if (simple_chinese_name == '' || traditional_chinese_name == '' || english_name == '') {
                    layer.msg('缺少数据');
                    return false;
                }
                $.ajax({
                    url: '/admin/newRoles/add',
                    type: 'post',
                    data: {
                        simple_chinese_name: simple_chinese_name,
                        traditional_chinese_name: traditional_chinese_name,
                        english_name: english_name,
                        _token: '{{csrf_token()}}'
                    },
                    dataType: 'json',
                    success: function (data) {
                        console.log(data);
                        if (data.code == 0) {
                            layer.msg('操作成功', {icon: 1});
                            setTimeout(function () {
                                location.reload();
                            }, 1000);
                        } else {
                            layer.msg(data.msg, {icon: 0});
                            return false;
                        }
                    }
                });
            });
        });
    </script>
@endsection
